8816
15008
Különböző vásárlókhoz tartozó termékeket szeretnék megjeleníteni. Ebből a célból az adatokat egy ajax híváson keresztül lehívom, és az adatokat minden egyedi ügyfél alapján csoportosítom. Ezután csatolom a csoportosított adatokat a HTML-fájlomhoz.
A csoportosított adatok szerkezete a következőképpen néz ki:
"Gipsz Jakab": [
{
"Item_id": 1
"Item_name": "abc"
},
{
"Item_id": 2
"Item_name": "def"
},
],
"Jane Doe":
{
"Item_id": 3
"Item_name": "ghi"
},
{
"Item_id": 4
"Item_name": "jkl"
},
]
A kódom így néz ki:
$ .each (groupedData, function (kulcs, érték) {
$ ('. cust_items'). append (`

`+ billentyű +`

Tételszám Tétel neve
`); $ .each (érték, függvény (ky, val) { $ ('# dataTable tbody'). append ( `+ ky +` "+ val. Tétel_név +" `); }); }); Egy vád előtt állok, amelynek során az összes elem az első ügyfél alatt jelenik meg, míg az adatok helyesen jelennek meg a második ügyfél alatt.
Hiányzik a vessző, miután a tulajdonságok és a Jane Doe tulajdonság objektumai nem szerepelnek a [] mezőben. Fontolja meg a groupedData objektum megváltoztatását, mivel a szintaxis nem megfelelő.
Szerkesztés: Ezenkívül módosítsa a sablon karaktersorozatát, és hozzáférjen a táblához dinamikus azonosítóval is.
Minta:
let groupedData = {
"Gipsz Jakab": [{
"Item_id": 1,
"Item_name": "abc"
},
{
"Item_id": 2,
"Item_name": "def"
}
],
"Jane Doe": [{
"Item_id": 3,
"Item_name": "ghi"
},
{
"Item_id": 4,
"Item_name": "jkl"
}
]
};
$ .each (groupedData, function (kulcs, érték) {
$ ('. cust_items'). append (`

$ {kulcs}

Tételszám Tétel neve
`); $ .each (érték, függvény (ky, val) { $ (`#dataTable _ $ {key.split ('') .join ('_')} tbody`) .append ( $ {ky} $ {val.Item_name} `); }); });
| Kicsit elkéstem a buliból, de itt egy szórakoztató és praktikus módszer az adatok dinamikus megjelenítésére az